<template>
	<view>
		<view class="name">
			<P style="font-size: 60rpx; margin-top: ;">{{ user.user_id }} | {{ user.real_name }}</P>
		</view>
		<view class="detail">
			<template v-for="item in transformed">
				<ListItem :title='item.name' :value='item.value'></ListItem>
			</template>
		</view>

	</view>
</template>

<script>
import ListItem from '@/components/basicListItem/particulars/particulars.vue'
import common from '@/api/common.js'
export default {
	components: {
		ListItem
	},
	data() {
		return {
			isShow:false,
			user: {},
			transformed: [],
			queryParams: {
				page: '1',
				itemsPerPage: '10',
				sortBy: [{
					key: "",
					order: ""
				}],
				search: ""
			},
		}
	},
	onLoad(option) {
		this.user = JSON.parse(decodeURIComponent(option.user));
		const extractList = ['real_name','role_id','school', 'major','year', 'email','phone','wechat_id','class_hour']; // 需要提取的项列表
		this.transformed = Object.entries(this.user).reduce((acc, [key, value]) => {
			if (extractList.includes(key)) { // 检查键是否存在于提取列表中
					acc.push({ name: key, value });
			}
			return acc;
		}, []);
	},
	methods: {

	}
}
</script>

<style scoped>
page
{
	background: #000;
}

.name
{
	height: 212rpx;
	color: #FFFFFF;
	text-align: center;
	padding: 48rpx 0;
}

.detail
{
	width: 750rpx;
	/* height: 1330rpx; */
	background: #F5F5F5;
	box-shadow: 0rpx -32rpx 80rpx 2rpx rgba(7, 31, 15, 0.2);
	border-radius: 80rpx 80rpx 0 0;
	padding-top: 72rpx;
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	align-content: flex-start;
}</style>